﻿@{
    string currentWallpaperImagePath = Url.Content(PersonalWebSite.Common.Wallpaper.CurrentWallpaperImagePath ?? PersonalWebSite.Common.Wallpaper.FetchNextWallpaperImagesPath());
}

<div id="WallpaperMain" class="Wallpaper" style="background-image: url('@currentWallpaperImagePath')">&nbsp;</div>

<img id="WallpaperImagePreloader" src="" alt="" style="display: none;" />

<div id="WallpaperControlsMainWrapper">
    <div class="MainMenuIcon Icon Fill DisplayWindows" style="display: none;" title="Wallpaper Options"></div>
    <div class="OptionsWrapper" style="display: none;">
        <div class="Item Icon Fill Refresh" title="Force wallpaper change" onclick="WallpaperSwitch();"></div>
        <div class="Item Icon Fill Save" title="Download current wallpaper image" onclick="WallpaperDownloadCurrent();"></div>
        <div class="Item Icon Fill Exit" title="View current wallpaper image; opens as full image in separate windows" onclick="WallpaperOpenInNewWindow();"></div>
        <div class="Item Icon Fill DisplayEmpty" title="Toogle UI; view only the wallpaper image" onclick="WallpaperToogleUI();"></div>
        <div class="Item Icon Fill Comment" title="Credits, image sources">
            <a href="@Url.Action("Wallpapers", "Credits")" style="display: block; width: 100%; height: 100%;"></a>
        </div>
    </div>
</div>

<script type="text/javascript">

    //Wallpaper timeout in milliseconds
    var wallpaperTimeout = @PersonalWebSite.Common.Wallpaper.WallpaperChangeInterval;
    var currentWallpaperPath = '@currentWallpaperImagePath';
    var isWallpaperSwitching = false;
    var wallpaperChangeTimeoutId = -1;
    var wallpaperChangeAjaxIconId = -1;

    $('#WallpaperImagePreloader').load(function () {
        var nextWallpaperImagePath = $(this).attr("src");

        var mainWallpaperJq = $("#WallpaperMain");
        var nextWallpaperJq = mainWallpaperJq.clone().css({ opacity: 0, "background-image": 'url("' + nextWallpaperImagePath + '")' }).appendTo(mainWallpaperJq).animate({ opacity: 1 }, 2000, function () {
            mainWallpaperJq.css("background-image", 'url("' + nextWallpaperImagePath + '")');
            nextWallpaperJq.remove();
            currentWallpaperPath = nextWallpaperImagePath;
            isWallpaperSwitching = false;
            AjaxIconToggle(false, wallpaperChangeAjaxIconId);
        });

        wallpaperChangeTimeoutId = setTimeout(WallpaperSwitch, wallpaperTimeout);
    }).error(function () {
        if($(this).attr('src') == '') //First load
            return;
        wallpaperChangeTimeoutId = setTimeout(WallpaperSwitch, wallpaperTimeout);
        isWallpaperSwitching = false;
        AjaxIconToggle(false, wallpaperChangeAjaxIconId);
        NotifierShow('Some error occured while trying to load the wallpaper image, I\'m very sorry for that but please try again.');
    });

    function WallpaperSwitch() {
        if(isWallpaperSwitching)
            return;

        wallpaperChangeAjaxIconId = AjaxIconToggle(true);
        clearTimeout(wallpaperChangeTimeoutId);
        isWallpaperSwitching = true;
        $.ajax('@Url.Action("NextWallpaper", "Wallpaper")', {
            success: function (data, textStatus, jqXHR) {

                var nextWallpaperImagePath = data.Path;

                $("#WallpaperImagePreloader").attr("src", nextWallpaperImagePath);
            },
            error: function (jqXHR, textStatus, errorThrown) {
                wallpaperChangeTimeoutId = setTimeout(WallpaperSwitch, wallpaperTimeout);
                isWallpaperSwitching = false;
                AjaxIconToggle(false, wallpaperChangeAjaxIconId);
                NotifierShow('Some error occured while trying to change the wallpaper, I\'m very sorry for that but please try again.');
            }
        });
        
    };
    wallpaperChangeTimeoutId = setTimeout(WallpaperSwitch, wallpaperTimeout);

    $("#WallpaperControlsMainWrapper .Icon").tooltipsy({offset: [5, 0]});

    $("#WallpaperControlsMainWrapper .OptionsWrapper").mouseleave(function(){
        $("#WallpaperControlsMainWrapper .MainMenuIcon, #WallpaperControlsMainWrapper .OptionsWrapper").stop().animate({opacity: 0}, function(){$(this).hide()});
    });

    $("#WallpaperControlsMainWrapper").mouseenter(function(){
        $(this).find(".MainMenuIcon").css({opacity: 0}).show().stop().animate({opacity: 1});
    });

    $("#WallpaperControlsMainWrapper .MainMenuIcon").mouseenter(function(){
        $("#WallpaperControlsMainWrapper .OptionsWrapper").css({opacity: 0}).show().stop().animate({opacity: 1});
    });

    function WallpaperOpenInNewWindow(){
        window.open(currentWallpaperPath, "Wallpaper");
    };

    function WallpaperDownloadCurrent(){
        window.location = '@Url.Action("DownloadCurrentWallpaper", "Wallpaper")';
    };

    var wallpaperIsUIVisible = true;
    var uiElementsJq = $("body > :visible:not(.Wallpaper,#WallpaperControlsMainWrapper)");
    function WallpaperToogleUI(isUIVisible){
        wallpaperIsUIVisible = isUIVisible != null ? isUIVisible : !wallpaperIsUIVisible;

        if(wallpaperIsUIVisible)
            uiElementsJq.fadeIn(globalAnimationDuration);
        else
            uiElementsJq.fadeOut(globalAnimationDuration);
    };
</script>